<template>
	<gui-page ref="guiPage" :customFooter="true">
		<!-- 页面主体 -->
		<template v-slot:gBody>
			<index1 v-if="actionPage=='index' && useNewIndex"></index1>
			<index v-if="actionPage=='index' && !useNewIndex"></index>
			<!-- <serve v-if="actionPage=='serve'"></serve> -->
			<news v-if="actionPage=='news'" :loadMore="newsLoadMore" @loadComplete="onNewsLoadComplete" />
			<member v-if="actionPage=='member'"></member>
			<activity v-if="actionPage=='activity'"></activity>
			<!-- <workbench v-if="actionPage=='workbench'"></workbench> -->
			<my v-if="actionPage=='my'"></my>
			<!-- <footerNav @change_page="change_page"></footerNav> -->
		</template>
		<template v-slot:gFooter>
			<view class="gui-relative nav_bar">
				<gui-flex :customClass="['gui-footer']" direction="row" :wrap="false" alignItems="center">
					<view class="gui-footer-icon-buttons" v-for="(item,index) in pages" @tap="navChange(index)">
						<image v-if="index!=2" class="nav_img" :src="currentIndex == index ? item.selectIcon:item.icon"
							mode="aspectFill"></image>
						<!-- gui-primary-color -->
						<text v-if="index!=2" :class="[
										currentIndex == index ? 'yanse' : 'gui-color-gray', 
										'gui-icons', 
										'gui-footer-icon-buttons-text', 
										'gui-block'
									]">{{item.title}}</text>
					</view>
				</gui-flex>

				<view class="gui-footer-buttons-ab" @tap="navChange(2)">

					<image :class="pages[2].title.includes('会员证') ? 'hyz_nav_img' : 'nav_img'" :src="pages[2].icon"
						alt="" mode="aspectFill" />
					<text :class="[
									currentIndex == 2 ? 'yanse' : 'gui-color-gray', 
									'gui-icons', 
									'gui-footer-icon-buttons-text', 
									'gui-block'
								]">{{pages[2].title}}</text>
				</view>
			</view>

		</template>
	</gui-page>
</template>

<script>
	import index from "@/pages/switchPages/index";
	import member from "@/pages/member/member";
	import my from "@/pages/switchPages/my";
	import serve from "@/pages/switchPages/serve";
	import news from "@/pages/switchPages/news";

	import index1 from "@/pages/switchPages/index1";
	import activity from "@/pages/switchPages/activity";
	import center from "@/pages/switchPages/center";
	import workbench from "@/pages/switchPages/workbench";
	// import footerNav from "@/pages/switchPages/nav.vue";
	import config from "@/config.js";
	export default {
		data() {
			return {
				actionPage: "index",
				currentIndex: 0,
				user_member: null,
				newsLoadMore: false, // 控制news组件加载更多
				useNewIndex: config.useNewIndex, // 从配置文件读取首页版本设置
				pages: [{
						name: 'index',
						title: '首页',
						icon: '/static/homePage/shouye.png',
						selectIcon: '/static/homePage/shouye1.png'
					},
					// {
					// 	name: 'serve',
					// 	title: '服务',
					// 	icon: '/static/homePage/fuwu.png',
					// 	selectIcon: '/static/homePage/fuwu1.png'
					// },
					{
						name: 'news',
						title: '新闻资讯',
						icon: '/static/homePage/fuwu.png',
						selectIcon: '/static/homePage/fuwu1.png'
					},
					{
						name: 'member',
						title: '会员证',
						icon: '/static/img/lg_logo.png',
						selectIcon: '/static/img/lg_logo.png',
					},
					// {
					// 	name: 'workbench',
					// 	title: '工作台',
					// 	icon: '/static/homePage/gongzuotai.png',
					// 	selectIcon: '/static/homePage/gongzuotai1.png'
					// },
					{
						name: 'activity',
						title: '活动',
						icon: '/static/homePage/huodong.png',
						selectIcon: '/static/homePage/huodong1.png'
					},
					{
						name: 'my',
						title: '我的',
						icon: '/static/homePage/wode.png',
						selectIcon: '/static/homePage/wode1.png'
					},
				],
				// centerPage:{name:'index',title:'首页',icon:'/static/homePage/shouye.png',selectIcon:'/static/homePage/shouye1.png'},

			}
		},
			components: {
		member,
		index,
		index1,
		my,
		serve,
		news,
		activity,
		center,
		workbench
	},
		onLoad(opt) {
			console.log(this.pages);
			let self = this;
			if (opt.p) {
				this.actionPage = opt.p;
			}
			if (opt.i) {
				this.currentIndex = opt.i;
			}
			if (opt.name) {
				for (let key in this.pages) {
					if (this.pages[key].name == opt.name) {
						this.currentIndex = key;
					}
				}
			}
			uni.getStorage({
				key: "member",
				success(data) {
					console.log(data);
					self.user_member = data;
				},
				fail() {
					console.log("没有用户信息->重新登录!");
					uni.reLaunch({
						url: "/pages/login/login"
					})
				}
			})

		},
		onReachBottom() {
			// 只有在新闻页面时才触发加载更多
			if (this.actionPage === 'news') {
				this.newsLoadMore = true;
			}
		},
		methods: {
			navChange: function(index) {
				this.currentIndex = index;
				this.actionPage = this.pages[index].name;
				console.log("actionPage", this.actionPage);
				uni.setNavigationBarTitle({
					title: this.pages[index].title
				})
			},
			onNewsLoadComplete() {
				// 重置加载更多状态
				this.newsLoadMore = false;
			}
		}
	}
</script>

<style>
	.nav_img {
		width: 50rpx;
		height: 50rpx;
	}

	.hyz_nav_img {
		width: 80rpx;
		height: 80rpx;
	}

	.nav_bar {
		border-top: solid 1rpx #ccc;
	}

	.gui-footer-icon-buttons {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		background-color: #fff;
	}

	.gui-footer-buttons-ab {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: -50rpx;
		justify-content: space-around;
		background-color: #fff;
		border-radius: 50% 50% 0% 0%;
		border-top: solid 1rpx #ccc;
		/* width: 156rpx; */
	}

	.yanse {
		color: #6791F9;
	}
</style>